{{ define "content" }}
<article class="fbox">
  <header class="entry-header">
  </header>
  <div class="ui segment">
    <div>
        {{ range .List }}
        <div class="btn" style="margin-bottom:8px;">{{ . }}</div>
        {{ end }}
    </div>
    <div><ol id="gather-item-list"></ol></div>
  </div>
</article>
{{ end }}
{{ define "extend_script" }}
<script>
  $ = jQuery

  $('.btn').click(function() {
    var name = $(this).text();
    if (name.length == 0) {
      return;
    }

    $.ajax({
      type: 'POST',
      url: '/gather/' + encodeURIComponent(name),
      success: result => {
        if (result) {
          $('#gather-item-list').html('');
          var gather_item_list = [];
          for (var i = 0; i < result.length; i++) {
            var tmp = `<li><a target="_blank" href="(url)">(title)</a></li>`
            tmp = tmp.replace('(url)', result[i].Url)
            tmp = tmp.replace('(title)', result[i].Title)
            gather_item_list.push(tmp)
          }
          $('#gather-item-list').html(gather_item_list.join(''));
        }
      },
    });
  })
</script>
{{ end }}